

/*
  请求地址:http://localhost:8101/api/weather/getWeather
  请求方法:get
  请求参数:city(城市名)
  响应内容:天气信息

  1. 点击回车
  2. 查询数据
  3. 渲染数据
  */


  var app = new Vue({
    el:"#app",
    data:{
        inputCity:"武汉",
        forecastList:[{ "date": "星期二2024-04-16",
        "fengli": "1级", "fengxiang": "暖风",
        "high": "高温 3℃", "low": "低温 1℃", "type": "小雨" }]
    },
    methods: { // 实现获得此城市的天气情况。axios发送网络请求
        getWeatherF:function(){ //+进行字符串的拼接。
            var mthis = this;
            axios.get("http://localhost:8101/api/weather/getWeather?city="+this.inputCity).then(
                function(response){
                    console.log("inputCity： "+ mthis.inputCity)
                // console.log(response) // response.data是后端返回的封装好的数据。
                // console.log(response.data.data.forecast) //获取forecastList
                    mthis.forecastList = response.data.data.forecast
        // console.log("注意： "+response) error 拼接 使response失效了，啊啊啊！！！
                },function(err){
                    console.log(err)
                }
            )
        },
        clickSearch:function(clickCity){
            // 实现点击谁输入框就是谁
            this.inputCity = clickCity;
            // 然后获得此城市的天气情况
            this.getWeatherF();//调用方法，代码复用。
        }    
    },

  })








